<template>
    <!--详情页面下  预约看房 选项卡下的 头部展示内容-->
    <div>
        <el-table align="center"
                :data="ZxLookHouse"
                style="width: 100%">
            <el-table-column align="center"
                    prop="customer"
                    label="客户姓名"
                    min-width="100">
            </el-table-column>
            <el-table-column align="center"
                    prop="phone"
                    label="客户电话"
                    min-width="100">
            </el-table-column>
            <el-table-column align="center"
                    prop="houseName"
                    label="希望看的楼盘"
                    min-width="180">
            </el-table-column>
            <el-table-column align="center"
                    prop="address"
                    label="楼盘地址"
                    min-width="120">
            </el-table-column>
            <el-table-column align="center"
                    prop="getCar"
                    label="上车地点"
                    min-width="120">
            </el-table-column>
            <el-table-column align="center"
                    prop="lookTime"
                    label="预约看房时间"
                    min-width="180">
            </el-table-column>
            <el-table-column align="center"
                    prop="driver"
                    label="接送司机"
                    min-width="100">
            </el-table-column>
        </el-table>
    </div>
    <!--最开始用弹性盒模型写的-->
  <!--  <div>
        <div class="flex-container" >
            <div class="flex-item">
                <p>客户姓名:{{customer}}</p>
                <p>客户电话:{{phone}}</p>
                <p>希望看的楼盘：{{houseName}}</p>
            </div>
            <div class="flex-item">
                <p>楼盘地址：{{address}}</p>
                <p>上车地点：{{getCar}}</p>
            </div>
            <div class="flex-item">
                <p>预约看房时间：{{lookTime}}</p>
                <p>接送司机：{{driver}}</p>
            </div>
        </div>
    </div>-->
</template>
<!--详情页面下  预约看房 选项卡下的 头部展示内容  ===引入到Information-->
<script>
    export default {
        name: "ZxLookHouse",
       /* 最开始用弹性盒模型写的===接收父组件的参数*/
       /* props:['customer','phone','houseName','address','getCar','lookTime','driver'],*/
        /*买房管家下==详情页面==预约看房车 选项卡下===第一部分渲染内容*/
        data(){
            return {
                ZxLookHouse: [{
                    customer: '张三',
                    phone: '13800013800',
                    houseName: '中粮鸿云',
                    address: '锦江区-攀成钢',
                    getCar: '高新地铁口',
                    lookTime: '2020-11-04  06:22:15',
                    driver: '王五'
                },
                    {
                        customer: '张三',
                        phone: '13800013800',
                        houseName: '中粮鸿云',
                        address: '锦江区-攀成钢',
                        getCar: '高新地铁口',
                        lookTime: '2020-11-04  06:22:15',
                        driver: '王五'
                    }],
            }
        },
        methods:{
            /*管理报告按钮*/
            manageReport(){
                this.dialogFormVisible=true
            },
            onOpen(){

            },
            cancel(){
                this.dialogFormVisible=false
            },
            handleClick(tab, event) {
                /* console.log(tab, event);*/
            }
        }

    }
</script>

<style lang="less" scoped>
    .flex-container {
        display: -webkit-flex;
        display: flex;
        /*  width: 400px;
          height: 250px;*/
        background-color: lightgrey;
    }

    .flex-item {
        /*  background-color: cornflowerblue;*/
        width: 300px;
        height: 100px;
        margin: 20px;
        p{
            padding: 10px 0;
        }
    }
</style>